<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>提现</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }
    
        html {
            font-size: 62.5%;
        }
    
        img {
            width: auto;
            height: auto;
            max-width: 100%;
            max-height: 100%;
        }
    
        .main {
            width: 95%;
            margin: 0 auto;
            font-family: PingFangSC-Regular;
            position: relative;
        }
    
        .walletAddress {
            height: 50px;
            background: white;
            border-radius: 2px;
            /* line-height: 50px; */
            /* padding-left: 13%; */
            box-shadow: 0 1px 5px #E8E5EE;
            margin-top: 15px;
            position: relative;
            display: flex;
            align-items: center;
        }
    
        .walletAddress span {
            display: block;
            color: black;
            font-size: 12px;
            font-weight: bold;
            height: 18.1px;
            margin-left: 1%;
            line-height: 18.1px;
            width: 65px;
        }
    
        .walletAddress .hideWord {
            display: block;
            border-left: 1.5px solid rgba(0, 0, 0, 0.2);
            padding: 0 0 0 12px;
            margin-left: 8px;
            font-size: 12px;
            color: #979797;
            letter-spacing: -0.05px;
            text-align: left;
            height: 18.1px;
            line-height: 18.1px;
        }
    
        .walletAddressImg {
            width: 21.6px;
            height: 18.1px;
            margin-left: 8px;
        }
    
        .title {
            font-size: 14px;
            color: #222222;
            letter-spacing: -0.06px;
            /* margin-left: 13.1%; */
            margin-bottom: 9px;
            height: 20px;
            text-align: left;
            margin-top: 20px;
        }
    
        .inputCom {
            width: 58.1%;
            height: 40px;
            background: white;
            border: 1px solid white;
            border-radius: 4px;
            padding-left: 10px;
        }
    
        .words {
            font-size: 12px;
            color: #5175f3;
            letter-spacing: -0.05px;
            margin-left: 2.9%;
            width: 15%;
            line-height: 40px;
        }
    
        .com {
            display: flex;
            /* margin-left: 13.1%; */
            margin-bottom: 9px;
        }
    
        .sub {
            width: 76.3%;
            height: 43px;
            background: #1488f5;
            border-radius: 21.5px;
            text-align: center;
            line-height: 43px;
            font-size: 14px;
            color: #ffffff;
            letter-spacing: -0.06px;
            margin: 21px auto;
        }
    
        .back {
            float: right;
            text-align: right;
            margin-right: 31px;
            margin-top: 62px;
            /* margin-bottom: 50px; */
            font-family: PingFangSC-Regular;
            font-size: 12px;
            color: #95989F;
            letter-spacing: 0.45px;
            position: absolute;
            bottom: 20px;
            right: 0;
        }
    
        .sure {
            width: 220px;
            /* height: 100px; */
            background: white;
            box-shadow: 0 1px 5px #E8E5EE;
            position: fixed;
            top: 50%;
            left: 50%;
            margin-top: -50px;
            margin-left: -110px;
            margin: o auto;
            /* margin: 0 auto; */
        }
    
        .info {
            text-align: center;
            padding: 5%;
            border-bottom: 1px solid black;
        }
    
        .select {
            display: flex;
        }
    
        .cel,
        .yes {
            width: 49%;
            padding: 5%;
            text-align: center;
        }
    
        .cel {
            border-right: 1px solid black;
        }
    
        .yes {
            background: #1488f5;
        }
    
        .ivu-modal-body {
            text-align: center;
            font-size: 18px !important;
        }
    
        .banner {
            margin-top: 10px;
            padding-left: 10%;
            padding-right: 10%;
            padding-top: 20px;
            background: #eceff6;
            border-radius: 4px;
            padding-bottom: 30px;
        }
    </style>
</head>


<body>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script src="./vue.min.js"></script>
    <link rel="stylesheet" type="text/css" href="https://unpkg.com/iview/dist/styles/iview.css">
    <script type="text/javascript" src="https://unpkg.com/iview/dist/iview.min.js"></script>
    <script src="./set.js"></script>
    <div id="wrapp">
        <div class="main">
            <div class="walletAddress">
                <div class="walletAddressImg">
                    <img src="./assets/wallet.png" alt="">
                </div>
                <span>ERC20地址</span>
                <span type="text" class="hideWord">{{walletAddress | hideWord}}</span>
            </div>
            <div class="banner">
                <div class="title" v-if="coinName=='STORJ'">当前可用：{{mortgageData.storjsincome | showWord_8}}SOTRJ</div>
                <div class="title" v-if="coinName=='FILECOIN'">当前可用：{{mortgageData.filsincome | showWord_8}}FILECOIN</div>
                <div class="title" v-if="coinName=='PLC'">当前可用：{{mortgageData.plcsincome | showWord_8}}PLC</div>
                <div class="title">请输入您要提现的金额</div>
                <div class="com" v-if="coinName=='STORJ'">
                    <input class="inputCom" v-model='value_storj' placeholder="输入您要提现的STORJ">
                    <span class="words">{{coinName}}</span>
                </div>
                <div class="com" v-if="coinName=='FILECOIN'">
                    <input class="inputCom" v-model='value_fil' placeholder="输入您要提现的FILECOIN">
                    <span class="words">{{coinName}}</span>
                </div>
                <div class="com" v-if="coinName=='PLC'">
                    <input class="inputCom" v-model='value_plc' placeholder="输入您要提现的PLC">
                    <span class="words">{{coinName}}</span>
                </div>
                <div class="sub" @click='sub' v-if='value_storj'>提交申请</div>
                <div class="sub" @click='sub' v-else-if='value_fil'>提交申请</div>
                <div class="sub" @click='sub' v-else-if='value_plc'>提交申请</div>
                <div class="sub" v-else style="background:gray">提交申请</div>
                <div class="back" @click="backTo">返回&nbsp;&nbsp;&nbsp;></div>
                <div class="sure" v-show="sureStorj">
                    <Modal v-model="sub_1" @on-ok="ok_1" @on-cancel="cancel">
                        <p>您当前正在提现 <span style="color:red">{{value_storj}} STORJ</span></p>
                        <p>确认此操作吗？</p>
                    </Modal>
                </div>
                <div class="sure" v-show="sureFil">
                    <Modal v-model="sub_2" @on-ok="ok_2" @on-cancel="cancel">
                        <p>您当前正在提现 <span style="color:red">{{value_fil}} FILECOIN</span></p>
                        <p>确认此操作吗？</p>
                    </Modal>
                </div>
                <div class="sure" v-show="surePlc">
                    <Modal v-model="sub_3" @on-ok="ok_3" @on-cancel="cancel">
                        <p>您当前正在提现 <span style="color:red">{{value_plc}} PLC</span></p>
                        <p>确认此操作吗？</p>
                    </Modal>
                </div>
            </div>
        </div>
    </div>
    <script>
        let app = new Vue({
            el: "#wrapp",
            data: {
                walletAddress: "",
                session: '',
                walletAddress: '',
                coinName: '',
                PLCreadySuccess: [],
                PLCalreadySuccess: [],
                FILreadySuccess: [],
                FILalreadySuccess: [],
                STORJreadySuccess: [],
                STORJalreadySuccess: [],
                mortgageData: {},
                value_storj: '',
                value_plc: '',
                value_fil: '',
                sureStorj: false,
                sureFil: false,
                surePlc: false,
                sub_1: false,
                sub_2: false,
                sub_3: false
            },
            filters: {
                //字符串隐藏处理
                hideWord: function (string) {
                    let len = string.length;
                    let stringBefore = string.slice(0, 11);
                    let stringBeHand = string.slice(len - 10, len + 1);
                    let newString = stringBefore + "..." + stringBeHand;
                    return newString;
                },
                showWord_8: function (num) {
                    num = parseFloat(num)

                    return num.toFixed(8);
                },
            },
            created() {
                this.session = this.parseURL().session;
                this.walletAddress = this.parseURL().wallet;
                this.coinName = this.parseURL().coinName;
            },
            mounted() {
                this.tixian();
                this.getDiYa();
            },
            methods: {
                backTo() {
                    window.location.href = appUrl + "checkWalletAddress.html?session=" + this.session + "&wallet=" + this.walletAddress + "&coinName=" + this.coinName;
                },

                ok_1() {
                    this.value_storj = parseFloat(this.value_storj);
                    let param = {};
                    param["session"] = this.session;
                    param["storj"] = this.value_storj;
                    axios({
                        method: "post",
                        url: requestBaseUrl + "tianru/users/cash",
                        data: param,
                    })
                        .then(res => {
                            if (res.status == 200) {
                                alert('恭喜您！提交成功，审核通过后，将转入您的钱包地址中！');
                                window.location.href = appUrl + "checkWalletAddress.html?session=" + this.session + "&wallet=" + this.walletAddress + "&coinName=" + "STORJ";
                            }
                        })
                        .catch(err => {
                            // alert("网络连接错误");
                        });
                },
                ok_2() {
                    this.value_fil = parseFloat(this.value_fil);
                    let param = {};
                    param["session"] = this.session;
                    param["fil"] = this.value_fil;
                    axios({
                        method: "post",
                        url: requestBaseUrl + "tianru/users/cash",
                        data: param,
                    })
                        .then(res => {
                            if (res.status == 200) {
                                alert('恭喜您！提交成功，审核通过后，将转入您的钱包地址中！');
                                window.location.href = appUrl + "checkWalletAddress.html?session=" + this.session + "&wallet=" + this.walletAddress + "&coinName=" + "FILECOIN";

                            }
                        })
                        .catch(err => {
                            // alert("网络连接错误");
                        });
                },
                ok_3() {
                    this.value_plc = parseFloat(this.value_plc);
                    let param = {};
                    param["session"] = this.session;
                    param["plc"] = this.value_plc;
                    axios({
                        method: "post",
                        url: requestBaseUrl + "tianru/users/cash",
                        data: param,
                    })
                        .then(res => {
                            if (res.status == 200) {
                                alert('恭喜您！提交成功，审核通过后，将转入您的钱包地址中！');
                                window.location.href = appUrl + "checkWalletAddress.html?session=" + this.session + "&wallet=" + this.walletAddress + "&coinName=" + "PLC";

                            }
                        })
                        .catch(err => {
                            // alert(err);
                        });
                },

                sub() {
                    let sum = 0;
                    if (this.coinName == 'STORJ') {
                        for (let i = 0; i < this.STORJreadySuccess.length; i++) {
                            sum = sum + this.STORJreadySuccess[i].storjcash;
                        }
                        let storj = parseFloat(this.value_storj);
                        let all = sum + storj;
                        if (storj > this.mortgageData.storjsincome) {
                            alert("超过余额数了，亲");
                            this.value_storj = '';
                            return;
                        } else if (all > this.mortgageData.storjsincome) {
                            alert("超过余额数了，亲")
                            app.value_storj = '';
                            return;
                        } else if (storj == 0) {
                            alert("输入的金额必须大于0");
                            app.value_storj = '';
                            return;
                        }
                        this.sureStorj = true;
                        this.sureFil = false;
                        this.surePlc = false;
                        this.sub_1 = true;
                    } else if (this.coinName == 'FILECOIN') {
                        let sum = 0;
                        for (let i = 0; i < this.FILreadySuccess.length; i++) {
                            sum = sum + this.FILreadySuccess[i].filcash;
                        }
                        let fil = parseFloat(this.value_fil);
                        let all = sum + fil;

                        if (fil > this.mortgageData.filsincome) {
                            alert("超过余额数了，亲")
                            this.value_fil = '';
                            return;
                        } else if (all > this.mortgageData.filsincome) {
                            alert("超过余额数了，亲")
                            app.value_fil = '';
                            return;
                        } else if (fil == 0) {
                            alert("输入的金额必须大于0");
                            app.value_fil = '';
                            return;
                        }
                        this.sureStorj = false;
                        this.sureFil = true;
                        this.surePlc = false;
                        this.sub_2 = true;
                    } else {
                        for (let i = 0; i < this.PLCreadySuccess.length; i++) {
                            sum = sum + this.PLCreadySuccess[i].plccash;
                        }
                        let all = sum + parseFloat(this.value_plc);
                        console.log(this.value_plc)
                        console.log(sum);
                        console.log(all);
                        let plc = parseFloat(this.value_plc);
                        if (plc > this.mortgageData.plcsincome) {
                            alert("超过余额数了，亲")
                            app.value_plc = '';
                            return;
                        } else if (all > this.mortgageData.plcsincome) {
                            alert("超过余额数了，亲")
                            app.value_plc = '';
                            return;
                        } else if (plc == 0) {
                            alert("输入的金额必须大于0");
                            app.value_plc = '';
                            return;
                        }
                        this.sureStorj = false;
                        this.sureFil = false;
                        this.surePlc = true;
                        this.sub_3 = true;
                    }
                },
                cancel() {

                },

                //获取余额
                getDiYa() {
                    let param = {};
                    param["session"] = this.session;
                    axios({
                        method: "post",
                        url: requestBaseUrl + "tianru/users/subsidy",
                        data: param,
                    })
                        .then(res => {
                            if (res.status == 200) {
                                if(res.data.retcode=='00000'){
                                    app.mortgageData = res.data.subsidy;
                                }else if(res.data.retcode=='00006'){
                                    alert('session已过期，重新登录');
                    window.location.href="http://sky.valuechain.group/huijia/login.html";
                                }
                                
                            }
                        })
                        .catch(err => {
                            // alert("网络连接错误");
                        });
                },
                //提现记录
                tixian() {
                    let param = {}
                    param["session"] = this.session;
                    axios({
                        method: "post",
                        url: requestBaseUrl + "tianru/users/cashes",
                        data: param,
                    })
                        .then(res => {
                            if (res.status == 200) {
                                let tixianWhole = res.data.datas;
                                for (let i = 0; i < tixianWhole.length; i++) {
                                    if (tixianWhole[i].iscash == false) {
                                        if (tixianWhole[i].plccash != 0) {
                                            app.PLCreadySuccess.push(tixianWhole[i]);
                                        } else if (tixianWhole[i].storjcash != 0) {
                                            app.STORJreadySuccess.push(tixianWhole[i]);
                                        } else if (tixianWhole[i].filcash != 0) {
                                            app.FILreadySuccess.push(tixianWhole[i]);
                                        }
                                    } else {
                                        if (tixianWhole[i].plccash != 0) {
                                            app.PLCalreadySuccess.push(tixianWhole[i]);
                                        } else if (tixianWhole[i].storjcash != 0) {
                                            app.STORJalreadySuccess.push(tixianWhole[i]);
                                        } else if (tixianWhole[i].filcash != 0) {
                                            app.FILalreadySuccess.push(tixianWhole[i]);
                                        }
                                    }
                                }
                                if (app.PLCreadySuccess) {
                                    for (let i = 0; i < app.PLCreadySuccess.length; i++) {
                                        app.PLCreadySuccess[i].timestamp = app.chuliTime(app.PLCreadySuccess[i].timestamp);
                                    }
                                }
                                if (app.FILreadySuccess) {
                                    for (let i = 0; i < app.FILreadySuccess.length; i++) {
                                        app.FILreadySuccess[i].timestamp = app.chuliTime(app.FILreadySuccess[i].timestamp);
                                    }
                                }
                                if (app.STORJreadySuccess) {
                                    for (let i = 0; i < app.STORJreadySuccess.length; i++) {
                                        app.STORJreadySuccess[i].timestamp = app.chuliTime(app.STORJreadySuccess[i].timestamp);
                                    }
                                }
                                if (app.PLCalreadySuccess) {
                                    for (let i = 0; i < app.PLCalreadySuccess.length; i++) {
                                        app.PLCalreadySuccess[i].timestamp = app.chuliTime(app.PLCalreadySuccess[i].timestamp);
                                    }
                                }
                                if (app.FILalreadySuccess) {
                                    for (let i = 0; i < app.FILalreadySuccess.length; i++) {
                                        app.FILalreadySuccess[i].timestamp = app.chuliTime(app.FILalreadySuccess[i].timestamp);
                                    }
                                }
                                if (app.STORJalreadySuccess) {
                                    for (let i = 0; i < app.STORJalreadySuccess.length; i++) {
                                        app.STORJalreadySuccess[i].timestamp = app.chuliTime(app.STORJalreadySuccess[i].timestamp);
                                    }
                                }

                            }
                        })
                        .catch(err => {
                            // alert(err);
                        });
                },
                parseURL: function (_url) {
                    let queryString = '';
                    let url = _url || location.href;
                    let index = url.lastIndexOf('?');
                    let map = {};
                    /* 如果当前 url 没有 query-string*/
                    if (index > -1) {
                        let queryString = url.slice(index).split('?')[1];
                        queryString.split('&').forEach(function (item) {
                            let t = item.split('=');
                            map[t[0]] = t[1];
                        });
                    }
                    return map;
                },
                chuliTime: function (time) {
                    time = String(time);
                    let index = time.lastIndexOf(":")
                    let mon = time.slice(4, 6);
                    let day = time.slice(6, 8);
                    let fen = time.slice(9, index);
                    time = mon + "-" + day + " " + fen;
                    return time;
                }
            }
        })
    </script>
</body>

</html>